 /* 放大镜 */
 //鼠标移入缩略图
 //遮罩
 thum.onmouseover = function () {
    var big = document.querySelector(".big") 
    mask.style.display = "block";
    big.style.display = 'block';
    
     document.onmousemove = function (e) {
      //目前是根据左上角跟随 var mouseX = e.clientX - thum.offsetLeft;
      var mouseX = e.clientX - thum.offsetLeft - mask.offsetWidth/2;
      var mouseY = e.clientY - thum.offsetTop - mask.offsetHeight/2;
     //  console.log(e.clientX);
     //  console.log(e.clientY);
      console.log(typeof(thum.offsetLeft));
      //修改mask坐标，不越界。
      if(mouseX < 0){
        //左
        mouseX = 0;
      }
      if(mouseX + mask.offsetWidth > thum.offsetWidth){
       //右
        mouseX = thum.offsetWidth - mask.offsetWidth;
      }
      if(mouseY < 0){
        // 上
        mouseY = 0;
      }
      if(mouseY + mask.offsetHeight > thum.offsetHeight){
        mouseY = thum.offsetHeight - mask.offsetHeight;
      }
      // console.log(mouseX);
      //修改mask坐标
      mask.style.left = mouseX + "px";
      mask.style.top = mouseY + "px";
      //修改放大后图片的位置
      bigImg.style.left = -mouseX * 4 + "px";
      bigImg.style.top = -mouseY * 4 + "px";
     }
      
  }
 
     // 鼠标离开隐藏遮罩，清除移动事件
      thum.onmouseleave = function() {
         //清除移动事件
         document.onmousemove = null;
        mask.style.display = "none";
        big.style.display = "none"
      
      }
      